<template>
  <el-badge :is-dot="hasMessage" class="header-hint">
    <i class="el-icon-message-solid"></i>
  </el-badge>
</template>

<script>
export default {
  name: "HeaderHint",
  computed: {
    hasMessage() {
      return this.count > 0
    }
  },
  data () {
    return {
      count: 1
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.getMessage()
    })
  },
  methods: {
    getMessage () {
      this.count = 1
    }
  }
}
</script>

<style lang="scss" scoped>
.header-hint {
  height: 50px;
}
</style>